
<template>
  <div>
    <h2>{{ dance }}</h2>
    <!-- 轮播图 -->
    <van-swipe class="my-swipe" :autoplay="2000" indicator-color="orange">
      <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/跳舞1.jpg" /></van-swipe-item>
      <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/跳舞2.jpg" /></van-swipe-item>
      <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/跳舞3.jpg" /></van-swipe-item>
      <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/跳舞4.jpg" /></van-swipe-item>

      <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/跳舞6.jpg" /></van-swipe-item>
      <van-swipe-item><van-image width="100%" height="100%" fit="cover" src="/assets/跳舞7.jpg" /></van-swipe-item>
    </van-swipe>



  </div>
</template>

<script>
import { mapState } from 'vuex'

export default {
  name: 'Dance',
  computed: {
    ...mapState(['dance'])
  },
  data() {
    return {
      images: [

      ],
    };
  },
}
</script>


<style>
.my-swipe .van-swipe-item {
  color: #ffffff;
  width: 200px;
  height: 300px;
  font-size: 20px;
  line-height: 150px;
  text-align: center;
  background-color: #4e4c4c;
}
</style>